<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
<%@include file="/WEB-INF/views/include/head.jsp" %>
<%@include file="/WEB-INF/views/include/echarts.jsp" %>
<script type="text/javascript">	

$(function(){

		var selectList = $('div');
		$.each(selectList, function(index, row) {
			var rel = $(row).attr("rel");
					
		    if(rel){
		    var url = '${ctx}'+rel;		 	
		    $(this).load(url, {
				}, function(data) {

				});			    
		    }	    
		});
		

});

</script>
<style type="text/css">
.div_panel{
display: inline-block;
float: left;
}



#container {
    margin: 0 auto;
    width: 100%;
}
#container .msg-panel {
  border: 1px solid #cccccc;
  float: left;
  width: 100%;
  height: 100%;
}
#container .msg-panel .m-item {
    display: block;
    overflow: hidden;
}
#container .msg-panel .m-item a {
    color: #333;
    display: block;
    height: 24px;
    line-height: 24px;
    overflow: hidden;
    padding: 0 10px;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#container .msg-panel-header {
    background: rgba(0, 0, 0, 0) linear-gradient(to bottom, #FBFBFB 0px,#F4F4F4 100%) repeat-x scroll 0 0;
    padding: 5px;
}
.msg-panel-header .p-title {
    color: #0e2d5f;
    font-size: 12px;
    font-weight: bold;
    height: 16px;
    line-height: 16px;
    padding-left: 1px;
}
.msg-panel-header .p-icon {
    margin-top: -16px;
    position: absolute;
}
.msg-panel-header .p-tool {
    float: right;
    margin-top: -16px;
}
#container .msg-panel-body {
    background-color: #ffffff;
    border-top: 1px solid #cccccc;
    color: #000000;
    font-size: 12px;
    height: 220px;
    width: 100%;
}
#container .msg-panel .m-item a.new {
    color: red;
    text-decoration: none;
}

.refresh {
    background: rgba(0, 0, 0, 0) url("${ctxStatic}/images/refresh.gif") no-repeat scroll center center;
    display: inline-block;
    height: 16px;
    width: 16px;
}



.msg-panel-body .msg-items {
    height: 100%;
    margin-top: 6px;
}
.msg-panel-body .msg-items dd {
    float: left;
    height: 95px;
    margin: 3px 5px;
    width: 48%;
}
.msg-panel-body .msg-items dd.title {
    font-family: Microsoft YaHei;
    font-size: 16px;
}
.msg-panel-body .msg-items #home_msg {
    background-color: #6dccf3;
}
.msg-panel-body .msg-items #home_task {
    background-color: #ff9e65;
}

.msg-panel-body .msg-items #home_alert {
    background-color: #7ed084;
}

.msg-panel-body .msg-items #home_news {
    background-color: #B6A2DE;
}

.msg-panel-body .msg-items #home_warning {
    background-color: #5AB1EF;
}

.msg-panel-body #fm-msg-btn-d {
    background: #c0ffd7 none repeat scroll 0 0;
    border: 1px dotted #29b34f;
    margin: 10px auto;
    padding: 10px;
    width: 446px;
}
.msg-panel-body .msg-items dd p.header {
    font-family: Microsoft YaHei;
    font-size: 14px;
    font-weight: bold;
}
.msg-panel-body .msg-items dd p {
    color: #fff;
    line-height: 30px;
    overflow: hidden;
    padding-left: 10px;
}
.msg-panel-body .msg-items dd a:hover {
    text-decoration: none;
}
.msg-panel-body .msg-items dd p .number {
    cursor: pointer;
    font-size: 2em;
    padding-left: 8px;
    vertical-align: top;
}

</style>	
</head>
<body class="gray-bg" style="background-color: #ffffff;height: 100%;padding-top: 8px;">
<!-- <div class="animated fadeInRight" style="padding: 8px;"> -->

					<c:forEach items="${plugList}" var="v">
					<div style="${v.desktopPlug.css}" id="div_${v.plugId}" rel="${v.desktopPlug.url}" class="div_panel">						
					</div>
					</c:forEach>				
<!-- </div> -->
</body>
</html>